<template>
  <dragSize
    v-for="item in dialogList"
    :key="item.RID"
    :kvm="item"
    :drag-min-height="560"
    :drag-min-width="880"
    :p-index="item.RID + '_' + item.id"
    :is-show="true"
    :z-index="item.zIndex || 10000"
    @selectItem="topDialog"
    @close="beforeClose"
  >
    <div class="dialog_content" @click="topDialog">
      <div style="height: 100%">
        <div class="terminalOption space-x-1 flex flex-row"></div>
        <div class="virtualiframe" style="width: 98%">
          <Logs
            style="color: #fff"
            :id="'dockerLog' + item.RID"
            :data="item.data"
          />
        </div>
      </div>
    </div>
  </dragSize>
</template>
<script setup>
import Logs from './logs.vue';
import dragSize from './dragSize.vue';
const emit = defineEmits(['closeDialog', 'topDialog']);
const props = defineProps({
  dialogList: {
    default: function () {
      return [];
    },
    type: Array,
  },
});

/**
 * 点击弹窗设置层级
 * @param item
 */
const topDialog = item => {
  emit('topDialog', item);
};

/**
 * 关闭弹窗
 * @param item
 */
const beforeClose = item => {
  emit('closeDialog', item);
};
</script>

<style lang="scss" scoped>
.dialog_content {
  width: 100%;
  height: 100%;
}
.virtualiframe {
  padding: unset;
  border-radius: unset;
  width: 90%;
  height: calc(100% - 10px);
}
</style>
